<template>
  <a-card :bordered="false">

    <!-- 查询区域 -->
    <div class="table-page-search-wrapper search-box-cuesList">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">

          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="数据名称">
              <a-input placeholder="请输入" v-model="queryParam.name"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="执行状态">
              <a-select v-model="queryParam.sureStatus" placeholder="请选择">
                <a-select-option value="">请选择</a-select-option>
                <a-select-option value="2">已执行</a-select-option>
                <a-select-option value="1">未执行</a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>

        </a-row>
      </a-form>
    </div>

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
    </div>

    <!-- table区域-begin -->
    <div>

      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" @change="handleTableChange">

        <span slot="action" slot-scope="text, record">
          <a @click="handleToList(record)">详情</a>
          &nbsp;&nbsp;
          <a @click="handleToEdit(record)">编辑</a>
          &nbsp;&nbsp;
          <a @click="exprotXls(record)">导出</a>
        </span>

      </a-table>
    </div>
    <!-- table区域-end -->

    <month-detail-model ref="monthDetailModel"></month-detail-model>
    <performance-month-add ref="performanceMonthAdd" @addThen="addThen"></performance-month-add>
  </a-card>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { getAction, downFile } from '@/api/manage'
import MonthDetailModel from './modules/MonthDetailModel'
import PerformanceMonthAdd from './modules/PerformanceMonthAdd'

export default {
  name: 'PerformanceMonthList',
  mixins: [JeecgListMixin],
  components: {
    MonthDetailModel,
    PerformanceMonthAdd
  },
  data() {
    return {
      description: 'PerformanceMonth管理页面',

      // 表头
      columns: [
        {
          title: '编号',
          align: 'center',
          dataIndex: 'id'
        },
        {
          title: '数据名称',
          align: 'center',
          dataIndex: 'name'
        },
        {
          title: '部门反馈进度',
          align: 'center',
          dataIndex: 'feedback'
        },
        {
          title: '执行状态',
          align: 'center',
          customRender: data => {
            if (data.sureStatus == 1) {
              return '未执行'
            }
            return '已执行'
          }
        },
        {
          title: '下发状态',
          align: 'center',
          customRender: data => {
            if (data.issueStatus == 1) {
              return '未下发'
            }
            return '已下发'
          }
        },
        {
          title: '创建时间',
          align: 'center',
          dataIndex: 'createTime'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          scopedSlots: { customRender: 'action' }
        }
      ],
      url: {
        list: '/performance/performanceMonth/list'
      }
    }
  },
  created() {},
  computed: {
    importExcelUrl: function() {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    }
  },
  methods: {
    handleToList(record) {
      // this.$refs.monthDetailModel.toList(record)
      this.$router.push({
        path: '/performance/PerformanceMonthView',
        query: { id: record.id }
      })
    },
    onDateChange: function(value, dateString) {
      this.queryParam.startTime = dateString[0]
      this.queryParam.endTime = dateString[1]
    },
    exprotXls: function(record) {
      var url = '/performance/performanceMonthDetail/exportXls'
      downFile(url, { perforMonthId: record.id, name: record.name, departId: this.queryParam.departId }).then(data => {
        if (!data) {
          this.$message.warning('文件下载失败')
          return
        }
        if (typeof window.navigator.msSaveBlob !== 'undefined') {
          window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName + '.xls')
        } else {
          let url = window.URL.createObjectURL(new Blob([data], { type: 'application/vnd.ms-excel' }))
          let link = document.createElement('a')
          link.style.display = 'none'
          link.href = url
          link.setAttribute('download', record.name + '.xls')
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link) // 下载完成移除元素
          window.URL.revokeObjectURL(url) // 释放掉blob对象
        }
      })
    },
    handleAdd() {
      this.$refs.performanceMonthAdd.edit()
    },
    handleToEdit(record) {
      this.$router.push({
        path: '/performance/PerformanceMonthEdit',
        query: { id: record.id }
      })
    },
    addThen(id) {
      this.searchQuery()
      this.$router.push({
        path: '/performance/PerformanceMonthEdit',
        query: { id: id }
      })
    }
  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>